<!DOCTYPE html>
<html>
<head>
    <title></title>
<#include "/header.html">

<style type="text/css"> 
.userAdd{cursor:pointer}
.userAddCheck{ position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #777;  
text-align:center;
font-size:28px; 
color:red;
 line-height:60px;
margin-left:6px;
margin-top:11px;
border-radius:55px;
            z-index: 1002; left: 0px;   
            opacity:0.5; -moz-opacity:0.5;   
            width:55px;
            height:55px;
}
</style>
</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
			<#if shiro.hasPermission("ccs:record:save")>
            <a class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
			</#if>
			<#if shiro.hasPermission("ccs:record:update")>
            <a class="btn btn-primary" @click="update"><i class="fa fa-pencil-square-o"></i>&nbsp;修改</a>
			</#if>
			<#if shiro.hasPermission("ccs:record:delete")>
            <a class="btn btn-primary" @click="del"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
			</#if>
        </div>
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>

    <div v-show="!showList" class="panel panel-default" >
        <div class="panel-heading col-sm-12">{{title}}</div>
        	<form class="form-horizontal layui-form" id="addRecordForm">
				    <div class="form-group">
                        <div class="col-sm-2 control-label">选题名称</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="record.recordName" placeholder="选题名称"/>
                        </div>
                    </div>
                     <div class="form-group">
                        <div class="col-sm-2 control-label">报题人</div>
                        <div class="col-sm-10">
                            <span class="form-control">{{user.username}}</span>
                        </div>
                    </div>
					<div class="form-group">
                        <div class="col-sm-2 control-label">选题简介</div>
                        <div class="col-sm-10">
							<textarea id="recordContent" v-model="record.recordContent"  class="form-control" style="display: none;"></textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">选题类型</div>
                        <div class="col-sm-10">
					       <select name="typeList" id="typeList" lay-verify="required"></select>
                        </div>
                    </div>
                    
					<div class="form-group">
                        <div class="col-sm-2 control-label">时间</div>
                        <div class="col-sm-10">
                        	<input type="text" class="layui-input" id="recordTime" readonly="readonly" v-model="record.recordTime" placeholder="请选择时间">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">地点</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="record.recordAddress" placeholder="地点"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">操作形式</div>
                        <div class="col-sm-10">
                        	<input type="checkbox" name="like[write]" title="直播">
						    <input type="checkbox" name="like[read]" title="短视频" checked>
<!--                             <input type="text" class="form-control" v-model="record.recordModality" placeholder="操作形式"/> -->
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">选题外链</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="record.recordLink" placeholder="选题外链"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">选题权限</div>
                        <div class="col-sm-10">
                        	<input type="radio"  v-model="record.recordOpen" name="record.recordOpen" value="1" title="公开，所有人可参与" checked="checked">
      						<input type="radio"  v-model="record.recordOpen" name="record.recordOpen" value="0" title="私密，仅指派人员可参与" >
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">审核人员</div>
                        <div class="col-sm-10">
                        	<select name="recordMuser" id="recordMuser" lay-verify="required"></select>
<!--                             <input type="text" class="form-control" v-model="record.recordMuser" placeholder="审核员"/> -->
                        </div>
                    </div>
                    <div class="form-group layer-alert">
                        <div class="col-sm-2 control-label">指派人员</div>
                        <div class="col-sm-10">
                        <!-- @click="addAUser"  -->
                            <input type="button" class="btn btn-primary layer-btn" data-type="addAUser" value="添加"/>
                        </div>
                    </div>
					<div class="form-group">
                        <div class="col-sm-2 control-label"></div>
                        <div class="col-sm-10">
                        	<div class="panel panel-default">
							  <div class="panel-body">
							    Basic panel example
							  </div>
							</div>
                        </div>
                    </div>
					<div class="form-group">
		                <div class="col-sm-2 control-label"></div>
		                <input type="button" class="btn btn-primary" @click="saveOrUpdate" value="确定"/>
		                &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
		            </div>
        </form>
    </div>
</div>
<!-- 指派人员 -->
<div id="AUserLayer" style="display: none;padding:10px;">
	<div class="layui-row layui-col-space10" style="padding-left: 40px">
		<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
			
	        <div class="layui-card">
	          	<img class="layui-circle" width="55px;" height="60px" src="${request.contextPath}/statics/images/user-default.png">	
				<div style="width:55px;text-align: center;">張三</div>
	        </div>
      	</div>
      	<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
	        <div class="layui-card">
	          	<img class="layui-circle" width="55px;" height="60px" src="${request.contextPath}/statics/images/user-default.png">	
				<div style="width:55px;text-align: center;">張三</div>
	        </div>
      	</div>
      	<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
	        <div class="layui-card">
	          	<img class="layui-circle" width="55px;" height="60px" src="${request.contextPath}/statics/images/user-default.png">	
				<div style="width:55px;text-align: center;">張三</div>
	        </div>
      	</div>
      	<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
	        <div class="layui-card">
	          	<img class="layui-circle" width="55px;" height="60px" src="${request.contextPath}/statics/images/user-default.png">	
				<div style="width:55px;text-align: center;">張三</div>
	        </div>
      	</div>
      	<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
	        <div class="layui-card">
	          	<img class="layui-circle" width="55px;" height="60px" src="${request.contextPath}/statics/images/user-default.png">	
				<div style="width:55px;text-align: center;">張三</div>
	        </div>
      	</div>
      	<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
	        <div class="layui-card">
	          	<img class="layui-circle" width="55px;" height="60px" src="${request.contextPath}/statics/images/user-default.png">	
				<div style="width:55px;text-align: center;">張三</div>
	        </div>
      	</div>
      	<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
	        <div class="layui-card">
	          	<img class="layui-circle" width="55px;" height="60px" src="${request.contextPath}/statics/images/user-default.png">	
				<div style="width:55px;text-align: center;">張三</div>
	        </div>
      	</div>
      	<div class="layui-col-sm4 layui-col-md3 layui-col-lg2">
	        <div class="layui-card">
	          	<img class="layui-circle" width="55px;" height="60px" src="${request.contextPath}/statics/images/user-default.png">	
				<div style="width:55px;text-align: center;">張三</div>
	        </div>
      	</div>
	</div>
</div>


<script src="${request.contextPath}/statics/js/modules/ccs/recordown.js?_${.now?long}"></script>

<script>
layui.config({
	base: '${request.contextPath}/statics/layui/' //静态资源所在路径
}).extend({
	index: 'lib/index' //主入口模块
}).use(['index'], function(){
	var $ = layui.$,admin = layui.admin,element = layui.element,layer = layui.layer;element.render();
	var active = {
		addAUser: function(){
	        layer.open({
	         title:'指派人员'
	         ,type: 1
	         ,shadeClose: true
	         ,area: admin.screen() < 2 ? ['80%', '300px'] : ['700px', '500px']
	         ,content: $("#AUserLayer")
	       });
		}
	}

	$('#addRecordForm .layer-alert .layer-btn').on('click', function(){
	    var type = $(this).data('type');
	    active[type] && active[type].call(this);
 	});
});




	layui.use('laydate', function(){
	  var laydate = layui.laydate;
	  //执行一个laydate实例
	  laydate.render({
	    elem: '#recordTime', //指定元素
	    format:"yyyy-MM-dd HH:mm:ss",
	    theme:"grid"
	  });
	});

	layui.use('layedit', function(){
		var layedit = layui.layedit;
		layedit.build('recordContent', {
			  tool: ['strong' //加粗
			         ,'italic' //斜体
			         ,'underline' //下划线
			         ,'del' //删除线
			         ,'|' //分割线
			         ,'left' //左对齐
			         ,'center' //居中对齐
			         ,'right' //右对齐
			         ,'link' //超链接
			         ,'unlink' //清除链接
			         ]
			});      
	});
</script>


</body>
</html>